8d:I[903690,["/chat-static/_next/static/chunks/0cxp4op0m1119.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2druaqheowhl8.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/00c0bu24wji78.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2o82vp45o81e5.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2lvmzw_lbp-jf.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2gyzl_dalq47j.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0sex0gcwdsmjy.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0wkge2f3s0f22.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1ggzqs8-kdl22.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0rrc9lo-bkkh5.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1j5k8gvtw8gdc.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/42mjea_hxrwdp.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0a4mwgsvj_bqu.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1t2vvxh4dupb4.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3-pn4n4eze_76.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1ovy71-w2povn.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/05vo5x924wz4s.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/37rh4z4c9595s.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0hms8tz4_m27c.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/332d35_pah0kr.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/18k2gve12j479.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1j9njtdk43kba.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1idn80rtjcasd.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0-pi40mz7bqkr.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2nl7z8xw_3un6.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1mo0iq2atp502.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3-9165k65ag24.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/326ugcf3n9jpc.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/27d-e_mtrq80p.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/046fqcvlcxx_w.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0h9h3jzy0z9y4.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1pr8_b61w-4h9.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/16ot-3kwt24hs.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3usbrh3-7_sgf.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/31wev-p231v4h.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/23crm4bdujzj_.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3crl-ybxc1u5r.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/24jtal64lwnrj.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/02buq-_-_ooco.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3ec3uj44xo5pu.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/013l2updr-opq.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0xfnk8tx-4t2w.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo"],"ExplicitChatIdProvider"] 8e:I[838238,["/chat-static/_next/static/chunks/0cxp4op0m1119.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2druaqheowhl8.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/00c0bu24wji78.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2o82vp45o81e5.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2lvmzw_lbp-jf.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2gyzl_dalq47j.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0sex0gcwdsmjy.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0wkge2f3s0f22.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1ggzqs8-kdl22.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0rrc9lo-bkkh5.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1j5k8gvtw8gdc.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/42mjea_hxrwdp.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0a4mwgsvj_bqu.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1t2vvxh4dupb4.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3-pn4n4eze_76.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1ovy71-w2povn.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/05vo5x924wz4s.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/37rh4z4c9595s.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0hms8tz4_m27c.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/332d35_pah0kr.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/18k2gve12j479.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1j9njtdk43kba.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1idn80rtjcasd.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0-pi40mz7bqkr.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/2nl7z8xw_3un6.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1mo0iq2atp502.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3-9165k65ag24.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/326ugcf3n9jpc.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/27d-e_mtrq80p.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/046fqcvlcxx_w.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0h9h3jzy0z9y4.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/1pr8_b61w-4h9.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/16ot-3kwt24hs.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3usbrh3-7_sgf.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/31wev-p231v4h.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/23crm4bdujzj_.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3crl-ybxc1u5r.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/24jtal64lwnrj.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/02buq-_-_ooco.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/3ec3uj44xo5pu.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/013l2updr-opq.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo","/chat-static/_next/static/chunks/0xfnk8tx-4t2w.js?dpl=dpl_3hJHqJizki2QG4Anj2fLMf8KWPZo"],"SWRDataProvider"] 8f:T2239,[V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" "use client" import { useState, useRef, useEffect } from "react" export default function ResumePage() { const [isDarkMode, setIsDarkMode] = useState(true) return (

{/* Theme toggle button in top right of left panel */} {/* Header */}

name.cv

FRONTEND . NEXTJS . DEV

{/* Experience Section */}

Startup 2025 → ....

Freelance 2023 → 2024

Acme 2019 → 2023

{/* Footer Links Section */}

Links Twitter Email Blog

{/* Custom DitheredNoise component */}

) } // Custom DitheredNoise component function DitheredNoise({ isDarkMode }: { isDarkMode: boolean }) { const canvasRef = useRef(null) const animationRef = useRef() const columnsRef = useRef>([]) const crypticCharsRef = useRef([ "Ω", "Ψ", "Φ", "Δ", "Λ", "Π", "Σ", "Θ", "Ξ", "Γ", "∞", "∑", "∏", "∫", "∂", "∇", "∆", "∴", "∵", "∈", "⊕", "⊗", "⊙", "⊥", "⊤", "⊢", "⊣", "⊨", "⊩", "⊪", "◊", "◈", "◉", "◎", "●", "◐", "◑", "◒", "◓", "◔", "▲", "▼", "◄", "►", "▪", "▫", "▬", "▭", "▮", "▯", "┌", "┐", "└", "┘", "├", "┤", "┬", "┴", "┼", "│", "═", "║", "╔", "╗", "╚", "╝", "╠", "╣", "╦", "╩", "⟨", "⟩", "⟪", "⟫", "⟬", "⟭", "⟮", "⟯", "⦀", "⦁", ]) const lastTimeRef = useRef(0) const canvasSizeRef = useRef({ width: 0, height: 0 }) useEffect(() => { const canvas = canvasRef.current if (!canvas) return const ctx = canvas.getContext("2d") if (!ctx) return // Set canvas size const resizeCanvas = () => { const rect = canvas.getBoundingClientRect() const newWidth = rect.width const newHeight = rect.height if (canvasSizeRef.current.width !== newWidth || canvasSizeRef.current.height !== newHeight) { canvas.width = newWidth * window.devicePixelRatio canvas.height = newHeight * window.devicePixelRatio ctx.scale(window.devicePixelRatio, window.devicePixelRatio) canvasSizeRef.current = { width: newWidth, height: newHeight } // Reset columns when canvas resizes columnsRef.current = [] } } resizeCanvas() window.addEventListener("resize", resizeCanvas) const columnWidth = 20 const fontSize = 14 const animate = (currentTime: number) => { const deltaTime = currentTime - lastTimeRef.current if (deltaTime < 16.67) { // Limit to ~60fps animationRef.current = requestAnimationFrame(animate) return } lastTimeRef.current = currentTime const { width, height } = canvasSizeRef.current const numColumns = Math.floor(width / columnWidth) if (columnsRef.current.length !== numColumns) { columnsRef.current = [] for (let i = 0; i < numColumns; i++) { const columnHeight = Math.floor(height / fontSize) + 10 columnsRef.current.push({ chars: Array(columnHeight) .fill(0) .map(() => crypticCharsRef.current[Math.floor(Math.random() * crypticCharsRef.current.length)]), speeds: Array(columnHeight) .fill(0) .map(() => Math.random() * 0.5 + 0.1), positions: Array(columnHeight) .fill(0) .map((_, i) => -i * fontSize - Math.random() * height), opacities: Array(columnHeight) .fill(0) .map(() => Math.random()), }) } } // Clear with dark background const bgColor = isDarkMode ? "#000000" : "#0a0a0a" ctx.fillStyle = bgColor ctx.fillRect(0, 0, width, height) ctx.font = `${fontSize}px "Courier New", "Lucida Console", monospace` ctx.textAlign = "center" const speedMultiplier = deltaTime * 0.06 const heightPlusFontSize = height + fontSize // Draw falling character columns columnsRef.current.forEach((column, colIndex) => { const x = colIndex * columnWidth + columnWidth / 2 column.chars.forEach((char, charIndex) => { const y = column.positions[charIndex] if (y > -fontSize && y < heightPlusFontSize) { // Matrix-style color gradient (orange theme) const distanceFromTop = y / height const baseOpacity = column.opacities[charIndex] if (isDarkMode) { // Bright orange at top, fading to dark orange const intensity = Math.max(0, 1 - distanceFromTop * 1.5) ctx.fillStyle = `rgba(255, ${Math.floor(140 * intensity)}, 0, ${baseOpacity * intensity})` } else { // Dark orange theme for light mode const intensity = Math.max(0, 1 - distanceFromTop * 1.2) ctx.fillStyle = `rgba(${Math.floor(180 * intensity)}, ${Math.floor(80 * intensity)}, 0, ${baseOpacity * intensity})` } ctx.fillText(char, x, y) } column.positions[charIndex] += column.speeds[charIndex] * fontSize * speedMultiplier // Reset when off screen if (column.positions[charIndex] > heightPlusFontSize) { column.positions[charIndex] = -fontSize - Math.random() * height column.chars[charIndex] = crypticCharsRef.current[Math.floor(Math.random() * crypticCharsRef.current.length)] column.speeds[charIndex] = Math.random() * 0.5 + 0.1 column.opacities[charIndex] = Math.random() } }) }) animationRef.current = requestAnimationFrame(animate) } animationRef.current = requestAnimationFrame(animate) return () => { window.removeEventListener("resize", resizeCanvas) if (animationRef.current) { cancelAnimationFrame(animationRef.current) } } }, [isDarkMode]) return

About

Tags

Share

About

Tags

Share

More from dagoatao

More Templates Like This